export const baseUsage = `
import {PhForm, PhFormColor, PhColor} from 'phoeon'
//支持验证器和v-model
interface PhFormColor{
    disabled:{type:Boolean,default:false},
    // value:{type:String,default:"#00000000"},
    preshow:{type:Boolean,default:true},
    precolors:{type:Array as PropType<Array<string>>}

    @change 改变事件
}
interface PhColor {
    ...同上，不支持验证器，不支持v-model
    
}

// note：
// PhFormColor（凡是PhForm为前缀的）表单组件支持v-model，需要PhForm作为父组件工作，可以指配合验证器使用，如需单独使用，
// import {PhColor} from 'phoeon' 用法同PhFormColor 但是没有验证功能，且不支持v-model
`;
export const demo1 = `
<ph-form>
    <ph-divider>表单默认</ph-divider>
    <ph-form-color
    style="width: 150px"
    v-model="value"
    
    />
    <ph-divider>表单关闭颜色预定义</ph-divider>
    <ph-form-color
    style="width: 150px"
    v-model="value"
    :preshow="false"
    
    />
    <ph-divider
    >自定义颜色预定义
    :precolors="['#ff0000','#ff0','#f0f','#0f0','#00f','#0ff']"</ph-divider
    >
    <ph-form-color
    style="width: 150px"
    v-model="value"
    :precolors="['#ff0000', '#ff0', '#f0f', '#0f0', '#00f', '#0ff']"
    
    />
    <ph-divider>表单禁止</ph-divider>
    <ph-form-color
    style="width: 150px"
    v-model="value"
    :disabled="true"
    />
</ph-form>
`;
export const demo2 = `
<ph-divider>表单默认</ph-divider>
<ph-color style="width: 150px" :value="value" @change="onChange" />
<ph-divider>表单关闭颜色预定义</ph-divider>
<ph-color
    style="width: 150px"
    :value="value"
    :preshow="false"
    @change="onChange"
/>
<ph-divider
    >自定义颜色预定义
    :precolors="['#ff0000','#ff0','#f0f','#0f0','#00f','#0ff']"</ph-divider
>
<ph-color
    style="width: 150px"
    :value="value"
    :precolors="['#ff0000', '#ff0', '#f0f', '#0f0', '#00f', '#0ff']"
    @change="onChange"
/>
<ph-divider>表单禁止</ph-divider>
<ph-color
    style="width: 150px"
    :value="value"
    :disabled="true"
    @change="onChange"
/>
`;
